<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>评论社区</title>
    <%- include common %>
</head>
<body>
    <%- include("head",{title:"comment",username}) %>
    <div class="container container-fluid">
        <div class="row" >
            <h2 class="text-primary">评论社区</h2>
        </div>
        <div class="thumbnail" style="margin-top: 20px;">
        <% data.forEach((item,i)=>{ %>
            <div style="min-height: 50px; margin: 20px;padding-bottom:20px;border-bottom: 1px solid #a8a8a8;">
                <p><%- item.time %></p> 
                <p style="margin-left: 20px;"><%- item.author %>:<%- item.content %></p>
                <div style="margin-left: 20px;background: #6c6c6c;" id="main">
                  <%  if(item.answer){ %>
                        <% item.answer.forEach((it,i)=>{ %>
                            <p style="margin-left: 20px;"><%- it.name %>:<%- it.say %></p>
                        <% }) %>
                  <%  } %>
                  

                </div>
                <div class="row">
                    <div class=" pull-right" style="margin-right:5px;display: flex;">
                        <input type="text" id="inp" class="from-control" style="width: 300px;height: 30px;display: none;">
                        <button class="btn btn-info "  id="replay" mid="<%- item._id%>">回复</button>
                    </div>
                </div>
               
                
            </div>   
        <% }) %>
        </div>
    </div> 
    <%- include foot %>
    <script>
        var idx = 1
        $(document).on("click","#replay",function(){
            if(idx){
                $(this).parent().find("#inp").css("display","block")
                $(this).html("确定")
                idx = 0
            }else{
                $.ajax({
                    url:"/comment/message",
                    method:"post",
                    data:{
                        mid:$(this).attr("mid"),
                        say:$("#inp").val()
                    },
                    success(res){
                        
                        var [res] = res.result
                        res = res.answer
                        console.log(res)
                        var html = ''
                        $(res).each((i,item)=>{
                            html += `<p style="margin-left: 20px;line-height:20px">${item.name}:${item.say}</p>`
                        })
                        $("#main").html(html)
                    }
                })
                $(this).parent().find("#inp").css("display","none")
                $(this).html("回复")
                idx = 1
            }
        })
    </script>
</body>
</html>